import { t } from 'i18next'
import React, { FC } from 'react'
import { IconNameAES, IconNameGM, IconNameQT, Wrap } from './style'
import { StateStore, useMccStore } from '@/pages/manager/store'
import shallow from 'zustand/shallow'

interface IMeetingName {
	className?: string
}
function getName(mccInfo: StateStore['mccInfo']) {
	let name = `${mccInfo.subject || ''}`
	if (mccInfo.meetingResourceVO.id !== 9 && mccInfo.meetingResourceVO.id !== 10) {
		name = `[${mccInfo.meetingResourceVO.name}]${name}`
	}
	if (mccInfo.superMtNum) {
		name = '[' + t('超大方') + ']' + name
	}
	if (mccInfo.meetingCategory === 1) {
		name = `[VCS]${name}`
	}
	return name
}
const MeetingNameIcons: FC = () => {
	const { quantumEncryption, encryptionType } = useMccStore(
		(state) => ({
			quantumEncryption: state.mccInfo.quantumEncryption,
			encryptionType: state.mccInfo.encryptionType,
		}),
		shallow
	)
	return (
		<>
			{quantumEncryption === 1 && <IconNameQT />}
			{encryptionType === 2 && <IconNameAES />}
			{(encryptionType === 3 || encryptionType === 4) && quantumEncryption === 0 && <IconNameGM />}
		</>
	)
}
export const MeetingName: FC<IMeetingName> = (props) => {
	const name = useMccStore((state) => getName(state.mccInfo), shallow)
	return (
		<>
			<MeetingNameIcons />
			<Wrap className={props.className} title={name}>
				{name}
			</Wrap>
		</>
	)
}
